<template>
    <div ref="splitChild" class="splitChild">
        <div ref="deviceControlled" class="deviceControlled">
            <DeviceControlled :allMethodDicSer="midSerData" />
        </div>
        <!-- <div ref="deviceScanned" class="deviceScanned">

        </div> -->
    </div>
</template>
<script setup lang="ts">
defineOptions({
    name: "DeviceList"
})
const props = defineProps({
    allMethodDicSer: {
        type: String,
        default: ""
    }
})
import DeviceControlled from "./DeviceControlled.vue";
import { onMounted, ref } from "vue";

const midSerData = ref("");

onMounted(() => {
    midSerData.value = props.allMethodDicSer;
})
</script>
<style lang="scss" scoped>
.splitChild {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
    background-color: #f3f3f3;
}
</style>